<!doctype html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Word</title>
    <link rel="stylesheet" href="./github.min.css">
    <script src="./highlight.min.js"></script>
    <style>
        code {
          font-size: 16px;
          line-height: 1.6;
           color: pink;
        }
    </style>
</head>
<body>
<pre><code></code></pre>
<script>
    /**
  * 将传入的字符串进行语法高亮处理，并将处理后的内容插入到页面的 <code> 元素中。
  * @param {string} str - 需要进行语法高亮处理的字符串。
  */
 function writeHtml(str) {
   // 选取页面中的 <code> 元素
   const el = document.querySelector('code');
   // 使用 highlight.js 的 highlightAuto 方法对传入的字符串进行自动语法高亮处理，
   // 并将处理后的 HTML 内容赋值给 <code> 元素的 innerHTML 属性
   el.innerHTML = hljs.highlightAuto(str).value;
 }
</script>
</body>
</html>